<template>
  <div class="shopmsg">
    <div class="shop-top">
      <div class="top-title">
        <span class="top-left-f" @click="ret">返回</span>店铺详情
      </div>
    </div>

    <div class="content-box" v-model="restaurant">
      <div class="content-title">名称:{{restaurant.restaurantName}}</div>
      <img :src="restaurant.url" alt="" />

      <div class="address">地址:{{restaurant.address}}</div>
      <div class="phone-tel">电话:{{restaurant.phone}}</div>

      <div class="introduce dian3">
        介绍:{{restaurant.remark}}
      </div>

      <div class="menu-list-btn">
        <button @click="goMenulist(restaurant.rid)">进入本店</button>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      menuListid: "",
      restaurant:{}
    };
  },
  created() {
    let id = this.$route.params.id;
    console.log(id);
    this.searchRestaurantMsg(id);
  },
  methods: {
    ret() {
      //this.$router.back(id);
      this.$router.push("/index");
    },
    goMenulist(id) {
      //console.log("rid------"+id)
      this.$router.push({
        name: "menuList",
        params: { rid: id },
      });
    },
    searchRestaurantMsg(id){
      this.$http.get("/restaurant/restaurant/selectByRid?rid="+id).then(result=>{
        if (result.data.code===2000){
          console.log(result.data.data)
          this.restaurant=result.data.data;
        }
      })
    }
  },
};
</script>


<style lang="less" scoped>
.shop-top {
  width: 100vw;
  height: 10.6667vw;
  background-color: #e74e40;
  display: flex;
  color: #fff;

  .top-title {
    width: 100vw;
    height: 10.6667vw;
    line-height: 10.6667vw;
    text-align: center;
    position: relative;
    .top-left-f {
      width: 13.3333vw;
      height: 10.6667vw;
      line-height: 10.6667vw;
      text-align: center;
      position: absolute;
      left: 0;
    }
  }
}

.content-box {
  width: 100vw;
  box-sizing: border-box;
  padding: 0 5.3333vw;
  margin-top: 5.3333vw;

  img {
    width: 100%;
    height: 53.3333vw;
    margin-top: 5.3333vw;
  }

  .address,
  .phone-tel {
    width: 100%;
    height: 8vw;
    margin-top: 5.3333vw;
  }

  .introduce {
    width: 100%;
    margin-top: 5.3333vw;
  }

  .menu-list-btn {
    width: 100%;

    button {
      width: 100%;
      height: 10.6667vw;
      background-color: #54cd6a;
      color: #fff;
      font-weight: 700;
      margin-top: 8vw;
    }
  }
}
</style>